{% extends "base.html" %}
{% load static %}



{% block title %}Model Comparison{% endblock %}
{% block extrahead %}

<script type="text/javascript">
$().ready(function() {
        // Show a loading animation when after hitting the submit button before the video is created.
        $('[id$=submit]').click(function() {
            $('#loading_image').show();
            $('#videos').hide();
        });
});
</script>

{%endblock%}
{% block navbar_items %}
<li><a href="{% url 'rmg:index' %}">RMG Tools</a></li>
<li><a href="{% url 'rmg:compare-models' %}">Model Comparison</a></li>
{% endblock %}

{% block sidebar_items %}
{% endblock %}

{% block page_title %}Model Comparison{% endblock %}

{% block page_body %}

<p>
<P>Compare two RMG models by uploading two chemkin files and their associated RMG Dictionary text files to generate an output HTML
page comparing the two models..  You must include an adjacency list for all species in each chemkin file, including
inerts.
</p>
<hr/>
<img src="{% static 'img/loading.gif' %}" alt="Loading..." style="display:none" id="loading_image">
{% if path %}
<a href ="../{{path}}">Click here for your generated output file.</a>
{% endif %}

<form enctype="multipart/form-data" action="" method="POST">{% csrf_token %}
{{ form.as_p }}
<p><input type="submit" value="Submit" id="submit"/></p>
</form>

{% endblock %}
